<!DOCTYPE html>
<html>

<!-- Mirrored from www.ivanjevremovic.in.rs/live/motivation/orange/index-content-slider.html by HTTrack Website Copier/3.x [XR&CO'2010], Mon, 18 Mar 2013 08:34:45 GMT -->
<head>
<title>Motivation</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta content="True" name="HandheldFriendly" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<meta name="viewport" content="width=device-width" />

<!--imports the main css file-->
<link rel="stylesheet" href="css/style.css" />
<!--imports the media queries css file-->
<link rel="stylesheet" href="../css/media-queries.css" />
<!--imports Anythingslider css file-->
<link rel="stylesheet" href="../css/anythingslider.css" />
<!--imports prettyPhoto css file-->
<link rel="stylesheet" href="../css/prettyPhoto.css" />

<!--imports Google Maps API key-->
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=AIzaSyB4_O6h-ezvPegVi23ZzEJV9FPuNeHOWXA&amp;sensor=true" ></script>


<!--imports jquery-->
<script src="../js/jquery-1.9.1.min.js"></script>
<script src="../js/jquery-migrate-1.1.0.min.js"></script>

<!--imports jquery form plugin-->
<script src="../js/jquery.form.js"></script>

<!-- imports the sticky plugin -->
<script src="../js/jquery.sticky.js"></script>

<!--imports jQuery Tools plugin-->
<script src="../js/jquery.tools.min.js"></script>

<!--imports scrollTo plugin-->
<script src="../js/jquery.scrollTo-1.4.3.1-min.js"></script>

<!--imports jquery nav plugin-->
<script src="../js/jquery.nav.js"></script>

<!--imports prettyPhoto plugin-->
<script src="../js/jquery.prettyPhoto.js"></script>

<!--imports twitter feed plugin-->
<script src="../js/jquery.tweet.js"></script>

<!--imports jQuery Easing plugin-->
<script src="../js/jquery.easing.1.2.js"></script>

<!--imports jQuery Anything Slider plugin-->
<script src="../js/jquery.anythingslider.min.js"></script>
<script src="../js/jquery.anythingslider.fx.min.js"></script>

<script>
$(document).ready(function() {	
		$('#content-slider ul').anythingSlider({			
			height: 310,
			delay: 4000,
			autoPlay: true,
			buildNavigation: false,
			hashTags: false, 
			buildArrows: true,
			expand: true
		})
		.anythingSliderFx({ 
		// base FX definitions 
		// '.selector' : [ 'effect(s)', 'size', 'time', 'easing' ] 
		// 'size', 'time' and 'easing' are optional parameters, but must be kept in order if added 
		/*'.description h2' : [ 'listLR', '', '400'],*/
		'.description, .slider-img' : ['fade'],
		'.slider-img'  : [ 'fade', '', '400' ], 
		'.description h2, .description span, .description p, .button' : [ 'listLR', '', '400', '' ] 
	  }); 
});
</script>

<!--imports custom javascript code-->
<script src="../js/custom.js"></script>

<!--[if IE 7]><link href="../css/ie7.css" rel="stylesheet" /><![endif]-->
<!--[if IE 8]>
	<link href="../css/ie8.css" rel="stylesheet" />
	<script src="../js/respond.js"></script>
<![endif]-->

<link rel="stylesheet" href="../css/layout.css" />
<script src="../js/options.js"></script>

</head>

<body class="pattern-11">

<!--  START STYLE SWITCHER (preview only)  -->

<div id="optwrap">		
	<div id="options">
	<div class="color-switcher">
		<div class="section cf">
			<strong>Change the color style</strong> <br />
			
			<ul class="color-styles">
				<li><a class="color-1" href="index-content-slider.html"></a></li>
				<li><a class="color-2" href="http://www.ivanjevremovic.in.rs/live/motivation/pink/index-content-slider.html"></a></li>						
				<li><a class="color-3" href="http://www.ivanjevremovic.in.rs/live/motivation/blue/index-content-slider.html"></a></li>
				<li><a class="color-4" href="http://www.ivanjevremovic.in.rs/live/motivation/red/index-content-slider.html"></a></li>
				<li><a class="color-5" href="http://www.ivanjevremovic.in.rs/live/motivation/cucumber-green/index-content-slider.html"></a></li>
				<li><a class="color-6" href="http://www.ivanjevremovic.in.rs/live/motivation/nepal-blue/index-content-slider.html"></a></li>
				<li><a class="color-7" href="http://www.ivanjevremovic.in.rs/live/motivation/purple/index-content-slider.html"></a></li>
				<li><a class="color-8" href="http://www.ivanjevremovic.in.rs/live/motivation/viola/index-content-slider.html"></a></li>
				<li><a class="color-9" href="http://www.ivanjevremovic.in.rs/live/motivation/turquoise/index-content-slider.html"></a></li>
			</ul>
		
		</div>
		
		</div>		
		
		<div class="section cf">		
			<strong>Body Backgrounds</strong> <br />
		
			<ul id="bg-patt">
					<li><a class="pattern-1" href="pattern-1.html"></a></li>
					<li><a class="pattern-2" href="pattern-2.html"></a></li>
					<li><a class="pattern-3" href="pattern-3.html"></a></li>
					<li><a class="pattern-4" href="pattern-4.html"></a></li>
					<li><a class="pattern-5" href="pattern-5.html"></a></li>
					<li><a class="pattern-6" href="pattern-6.html"></a></li>
					<li><a class="pattern-7" href="pattern-7.html"></a></li>
					<li><a class="pattern-8" href="pattern-8.html"></a></li>
					<li><a class="pattern-9" href="pattern-9.html"></a></li>
					<li><a class="pattern-10" href="pattern-10.html"></a></li>
					<li><a class="pattern-11" href="pattern-11.html"></a></li>
					<li><a class="pattern-12" href="pattern-12.html"></a></li>
				</ul>	
			</div>		
			
			<div class="section cf">		
				<strong>Left Side Backgrounds</strong> <br />
			
				<ul id="lbg-patt">
					<li><a class="pattern-19" href="pattern-19.html"></a></li>
					<li><a class="pattern-13" href="pattern-13.html"></a></li>
					<li><a class="pattern-14" href="pattern-14.html"></a></li>
					<li><a class="pattern-15" href="pattern-15.html"></a></li>
					<li><a class="pattern-16" href="pattern-16.html"></a></li>
					<li><a class="pattern-17" href="pattern-17.html"></a></li>
					<li><a class="pattern-18" href="pattern-18.html"></a></li>
				</ul>	
			</div>		
			
			<div class="section cf">		
				<strong>Right Side Backgrounds</strong> <br />
			
				<ul id="rbg-patt">
					<li><a class="pattern-27" href="pattern-27.html"></a></li>
					<li><a class="pattern-20" href="pattern-20.html"></a></li>
					<li><a class="pattern-21" href="pattern-21.html"></a></li>
					<li><a class="pattern-22" href="pattern-22.html"></a></li>
					<li><a class="pattern-23" href="pattern-23.html"></a></li>
					<li><a class="pattern-24" href="pattern-24.html"></a></li>
					<li><a class="pattern-25" href="pattern-25.html"></a></li>
					<li><a class="pattern-26" href="pattern-26.html"></a></li>
				</ul>		
		</div>	
	
		<div class="section">
			<strong>Nivo Slider Version</strong> <br />
			
			<a class="slider-link" href="index-nivo-slider.html"><img src="../img/option/nivo.jpg" alt="nivo slider link" /></a>
		
		</div>
				
	</div> <!-- END options -->
	<div id="closer">
		<a class="opener" href="#"></a>
		<a class="closerer" href="#"></a>
	</div>
	
</div><!-- END optwrap -->	

<!--  END STYLE SWITCHER (preview only)  -->

	<div id="container" class="cf">
	
		<div id="left-side" class="pattern-17">
		
			<div id="left-inner" class="cf">			
				
				<div id="logo">
					<h1><a class="local" href="#home"><img src="../img/logo/orange.png" alt="Motivation - a Single Page Portfolio" /></a></h1>
				</div><!-- end logo -->
				
				<div id="navigation" class="sticky-nav">
					<ul id="nav-scroll" class="nav">
						<li class="active"><a href="#home">Home</a></li>
						<li><a href="#about">About</a></li>
						<li><a href="#portfolio">Portfolio</a></li>
						<li><a href="#elements">Page Elements</a></li>
						<li><a href="#blog">Blog</a></li>
						<li><a href="#contact">Contact</a></li>
					</ul><!-- end nav -->
				</div><!-- end navigation -->
				
				<div id="social-networks">
					<h3>Let's Socialize!</h3>
				
					<ul id="social-links">
						<li class="facebook-bg" title="Facebook"><a href="#">Facebook</a></li>
						<li class="youtube-bg" title="Youtube"><a href="#">Vimeo</a></li>
						<li class="yahoo-bg" title="Yahoo"><a href="#">Yahoo</a></li>
						<li class="pinterest-bg" title="Pinterest"><a href="#">Pinterest</a></li>																			
						<li class="twitter-bg" title="Twitter"><a href="#">Twitter</a></li>
						<li class="dribbble-bg" title="Dribbble"><a href="#">Dribbble</a></li>
						<li class="google-bg" title="Google +"><a href="#">Google</a></li>				
					</ul><!-- end social-links -->
				</div><!-- end social-networks -->
				<div id="copyright">Copyright &copy; 2013 Motivation. All rights reserved</div><!-- end copyright -->
			</div><!-- end left-inner -->	
		</div><!-- end left-side -->
		
		<div id="right-side" class="pattern-20">
	
	<!-- HOME PAGE -->
		
			<div id="home" class="page cf">			
				<h2 class="title">Welcome To Motivation</h2>
				<p class="page-subtitle">-A Single Page Portfolio-</p>	

			<!-- BEGIN ANYTHING SLIDER -->

				<div id="content-slider-container">
					
						<div id="content-slider">
					 
							<ul>
								<!-- slide 1 -->
								<li>
									<div class="description">
										<span class="top-text">First long line of description text</span>
										<h2>Big Punch Line Here</h2>
										<span class="bottom-text">Another Line of Text With  bigger font</span>
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibec tempor ac, posuere id magna. Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. </p>
										
										<a class="button small-btn" href="#">Continue Reading</a>
									</div>
									<div class="slider-img last">
										<img src="../img/sliders/layer/001.png" alt="image" />
									</div>					
								</li>
								<!-- slide 2 -->
								<li>
									<div class="slider-img">
										<img src="../img/sliders/layer/002.png" alt="image" />
									</div>
									<div class="description last">
										<span class="top-text">First Long Line of Text With Words</span>
										<h2>Big Punch Line Here</h2>
										<span class="bottom-text">Another Line of Text With  bigger font</span>
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibec tempor ac, posuere id magna. Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. </p>
										
										<a class="button small-btn" href="#">Continue Reading</a>
									</div>					
								</li>
								<!-- slide 3 -->
								<li>
									<div class="description">
										<span class="top-text">First Long Line of Text With Words</span>
										<h2>Big Punch Line Here</h2>
										<span class="bottom-text">Another Line of Text With  bigger font</span>
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibec tempor ac, posuere id magna. Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. </p>
										
										<a class="button small-btn" href="#">Continue Reading</a>
									</div>
									<div class="slider-img last">
										<img src="../img/sliders/layer/004.png" alt="image" />
									</div>					
								</li>
								<!-- slide 4 -->
								<li>
									<div class="slider-img">
										<img src="../img/sliders/layer/003.png" alt="image" />
									</div>
									<div class="description last">
										<span class="top-text">First Long Line of Text With Words</span>
										<h2>Big Punch Line Here</h2>
										<span class="bottom-text">Another Line of Text With  bigger font</span>
										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibec tempor ac, posuere id magna. Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. </p>
										
										<a class="button small-btn" href="#">Continue Reading</a>
									</div>					
								</li>								
							</ul>	
						</div><!-- end content-slider -->
									
				</div><!-- end slider-container -->	

			<!-- END ANYTHING SLIDER -->
			
				<div class="tagline cf">
					<div class="tagline-text">
						<h2>Welcome to <span>Motivation</span> - a Single Page Portfolio</h2>
						<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibendum ac tempor 
						Fusce scelerisque pellentesqususpendisse elementum tellus vel volutpat.</p>
					</div><!-- end tagline-text -->
					
					<div class="tagline-btn">
						<a href="#"><span class="buy-btn"></span><span class="btn-text">Buy Now</span></a>
					</div><!-- end tagline-btn -->
				</div><!-- end tagline -->
				
				<div class="separator"></div>
				
				<div class="boxes-light cf">
					<div class="one-third">
						<div class="box">
							<h3>Definitely Maybe</h3>
							<span class="subtitle">Another Subtitle</span>
							<img src="../img/box-icons/light/cog.png" alt="image description" />
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>
							<a class="button small-btn" href="#">Read More</a>
						</div><!-- end box -->	
					</div>
					<div class="one-third">
						<div class="box">			
							<h3>What's The Story</h3>
							<span class="subtitle">Another Subtitle</span>
							<img src="../img/box-icons/light/bulb.png" alt="image description" />
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>		
							<a class="button small-btn" href="#">Read More</a>
						</div><!-- end box -->	
					</div>
					<div class="one-third last">
						<div class="box">
							<h3>Morning Glory</h3>
							<span class="subtitle">Another Subtitle</span>
							<img src="../img/box-icons/light/earth.png" alt="image description" />
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>	
							<a class="button small-btn" href="#">Read More</a>
						</div><!-- end box -->	
					</div>
				</div><!-- end boxes -->
				
				<div class="separator"></div>
				
				<div class="two-third">
					<div class="col-title">
						<h3>About Motivation</h3>
						<span class="subtitle">Another Subtitle</span>
					</div>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibenduac 
					tempor ac, <a href="#">posuere id magna</a>. Fusce scelerisque pellentesqususpendisse elementum tellus vel 
					volutpat. Proin sapien.</p>
					
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibenduac 
					tempor.</p>
				</div>
				
				<div class="one-third last">
					<div class="col-title">
						<h3>Force of Nature</h3>
						<span class="subtitle">Another Subtitle</span>
					</div>
					
					<p><strong>Proin  sapien risus, bibenduac 
					tempor ac, posuere id magna.</strong></p>
					
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibenduac 
					tempor ac, posuere id magna.</p>
				</div>						
			
				<div class="full-width cf">
					<span class="twitter-separator"></span>		
					<div class="twitter-feed"></div><!-- end twitter-feed -->
				</div>
				
				<div class="separator"></div>
			
			</div><!-- end home -->
			
			
	<!-- ABOUT PAGE -->	
	
			
			<div id="about" class="page cf">			
				<h2 class="title">About us</h2>
				<p class="page-subtitle">-Yet Another Subtitle-</p>		

				<div class="two-third">
					<div class="col-title">
						<h3>About Motivation</h3>
						<span class="subtitle">Few words about our company</span>
					</div>
					<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, 
					orci justo consequat massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas, 
					tellus ipsum rhoncus orci, eu vestibulum nisi orci quis nunc. Vivamus sit amet odio pellentesque odio faucibus tristique.</p>
					
					<p>Aenean porttitor, lectus at dapibus egestas, tellus ipsum rhoncus orci, eu vestiblum nisi orci quis nunc. Vivamus sit amet odio pellentesque odio faucibus </p>
				</div>
				
				<div class="one-third last">
					<div class="col-title">
						<h3>Skills</h3>
						<span class="subtitle">Check out our skill set</span>
					</div>
					
					<ul class="skills">
						<li><p class="skill-75"><span>PSD to HTML - 75&#37;</span></p></li>
						<li><p class="skill-80"><span>HTML to Wordpress - 80&#37;</span></p></li>
						<li><p class="skill-90"><span>SEO Optimization - 90&#37;</span></p></li>
						<li><p class="skill-85"><span>Branding SOlutions - 85&#37;</span></p></li>
						<li><p class="skill-65"><span>Logo Design - 65&#37;</span></p></li>
					</ul>
					
				</div>
				
				<div class="separator"></div>
				
				<div class="full-width cf">
					<div class="col-title">
						<h3>Meet The Team</h3>
						<span class="subtitle">Say Hello to our members</span>
					</div>
					
					<div class="team">
						<div class="member cf">
							<ul class="member-social">
								<li class="facebook-tran"><a href="#">Faebook</a></li>
								<li class="twitter-tran"><a href="#">Twitter</a></li>
								<li class="skype-tran"><a href="#">Skype</a></li>
								<li class="google-tran"><a href="#">Google</a></li>
							</ul>
							
							<div class="member-details">															
								<img class="member-img" src="../img/member-2.jpg" alt="image" />
								
								<div class="member-name">
									<h4>Jane Doe</h4>
									<span class="subtitle">Graphic Designer</span>
								</div><!-- end member-name -->
								
								<p>Fusce scelerisque pellentesqu
								suspendisse elementum tellus 
								vel volutpat. Proin sapien 
								fusce scelerisque </p>
							</div><!-- end member-details -->
							
						</div><!-- end member -->
						
						<div class="member cf">
							<ul class="member-social">
								<li class="facebook-tran"><a href="#">Faebook</a></li>
								<li class="twitter-tran"><a href="#">Twitter</a></li>
								<li class="skype-tran"><a href="#">Skype</a></li>
								<li class="linkedin-tran"><a href="#">LinkedIn</a></li>
								<li class="google-tran"><a href="#">Google</a></li>
							</ul>
							
							<div class="member-details cf">															
								<img class="member-img" src="../img/member-1.jpg" alt="image" />
								
								<div class="member-name">
									<h4>John Doe</h4>
									<span class="subtitle">Lead Designer</span>
								</div><!-- end member-name -->
								
								<p>Fusce scelerisque pellentesqu
								suspendisse elementum tellus 
								vel volutpat. Proin sapien 
								fusce scelerisque </p>
							</div><!-- end member-details -->
							
						</div><!-- end member -->
						
						<div class="member cf">
							<ul class="member-social">
								<li class="facebook-tran"><a href="#">Faebook</a></li>
								<li class="twitter-tran"><a href="#">Twitter</a></li>
								<li class="skype-tran"><a href="#">Skype</a></li>
								<li class="google-tran"><a href="#">Google</a></li>
							</ul>
							
							<div class="member-details">															
								<img class="member-img" src="../img/member-4.jpg" alt="image" />
								
								<div class="member-name">
									<h4>Johnathan Doeson</h4>
									<span class="subtitle">Creative Director</span>
								</div><!-- end member-name -->
								
								<p>Fusce scelerisque pellentesqu
								suspendisse elementum tellus 
								vel volutpat. Proin sapien 
								fusce scelerisque </p>
							</div><!-- end member-details -->
							
						</div><!-- end member -->
						
					</div><!-- end team -->
					
				</div>
				
				<div class="separator"></div>
				
				<div class="full-width cf">
				
					<div class="col-title">
						<h3>Services We Offer</h3>
						<span class="subtitle">List of Services we offer</span>
					</div>
					
					<div class="boxes-dark cf">					
						<div class="one-third">
							<div class="box">
								<h3>Live Forever</h3>
								<span class="subtitle">Another Subtitle</span>
								<img src="../img/box-icons/dark/arrows.png" alt="image description" />
								<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>
							</div><!-- end box -->	
						</div>
						<div class="one-third">
							<div class="box">			
								<h3>Champagne Supernova</h3>
								<span class="subtitle">Another Subtitle</span>
								<img src="../img/box-icons/dark/flag-2.png" alt="image description" />
								<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>
							</div><!-- end box -->	
						</div>
						<div class="one-third last">
							<div class="box">
								<h3>Hey Now!</h3>
								<span class="subtitle">Another Subtitle</span>
								<img src="../img/box-icons/dark/spanner.png" alt="image description" />
								<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>
							</div><!-- end box -->	
						</div>
						
						<div class="one-third">
							<div class="box">
								<h3>Morning Glory</h3>
								<span class="subtitle">Another Subtitle</span>
								<img src="../img/box-icons/dark/vol-up.png" alt="image description" />
								<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>							
							</div><!-- end box -->	
						</div>
						<div class="one-third">
							<div class="box">			
								<h3>Bring It On Down</h3>
								<span class="subtitle">Another Subtitle</span>
								<img src="../img/box-icons/dark/paper-plane.png" alt="image description" />
								<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>	
							</div><!-- end box -->	
						</div>
						<div class="one-third last">
							<div class="box">
								<h3>Supersonic</h3>
								<span class="subtitle">Another Subtitle</span>
								<img src="../img/box-icons/dark/film.png" alt="image description" />
								<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat. Proin sapien.</p>
							</div><!-- end box -->	
						</div>
					</div><!-- end boxes-dark -->
				</div>								
				
			</div><!-- end about -->
	
	
	<!-- PORTFOLIO PAGE -->

	
			<div id="portfolio" class="page">			
				<h2 class="title">Projects Showcase</h2>
				<p class="page-subtitle">-Yet Another Subtitle-</p>	
				
				<ul class="filter cf">				
					<li><a class="all current" href="all.html">All</a></li>
					<li><a href="photo.html">Photos</a></li>
					<li><a href="videohtml.html">Video</a></li>
					<li><a href="web.html">Web Design</a></li>
					<li><a href="graphic.html">Graphic Design</a></li>
				</ul>
				
				<ul class="portfolio-thumbs cf">
				
				<!-- First 9 portfolio entries visible -->
				
					<li class="video web photo">
						<img src="../img/portfolio/thumbs/001.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
						
					<li class="photo graphic">
						<img src="../img/portfolio/thumbs/005.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>		
					
					<li class="web">
						<img src="../img/portfolio/thumbs/003.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="play" href="http://www.youtube.com/watch?v=okISRer6g28" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
					
					<li class="graphic photo">
						<img src="../img/portfolio/thumbs/004.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
					
					<li class="video">
						<img src="../img/portfolio/thumbs/002.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="play" href="http://vimeo.com/7449107" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>					
					
					<li class="video web">
						<img src="../img/portfolio/thumbs/006.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="play" href="http://www.youtube.com/watch?v=okISRer6g28" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
					
					<li class="web photo">
						<img src="../img/portfolio/thumbs/002.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
						
					<li class="video">
						<img src="../img/portfolio/thumbs/003.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="play" href="http://www.youtube.com/watch?v=okISRer6g28" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
					
					<li class="graphic photo">
						<img src="../img/portfolio/thumbs/001.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
				
				<!-- Hidden portfolio entries -->
				
					<li class="photo">
						<img src="../img/portfolio/thumbs/005.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title </h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
						
					<li class="video">
						<img src="../img/portfolio/thumbs/004.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="play" href="http://www.youtube.com/watch?v=okISRer6g28" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>	
					
					<li class="photo">
						<img src="../img/portfolio/thumbs/006.jpg" alt="Image description" />
						<div class="overlay">
							<h5>Project Title</h5>
							<p>Fusce scelerisque pellentesqu suspendisse elementum tellus vel volutpat proi.</p>
							<div class="portfolio-buttons cf">
								<a class="zoom" href="../img/portfolio/large/001.jpg" data-pp-rel="prettyPhoto"></a>
								<a class="link last" href="#" ></a>
							</div><!-- end portfolio-buttons -->
						</div><!-- end overlay -->
					</li>				
				</ul>								
				
				<a id="load-more" class="button small-btn" href="#">Load More Projects</a>
				
			</div><!-- end portfolio -->
	

	<!-- ELEMENTS PAGE -->

	
			<div id="elements" class="page">			
				<h2 class="title">Page Elements</h2>
				<p class="page-subtitle">-Yet Another Subtitle-</p>						
				
				<div class="full-width-margin cf">
					<h3>Text With Image Left</h3>
					<img class="left-img" src="../img/placeholder.jpg" alt="Image description" />
					<p>Nulla id massa ac eros dignissim volutpat ac vel tortor. Praesent vel magna turpis, sed vehicula libero. Nullam viverra 
					ante vitae risus <a href="#">lobortis in sollicitudin</a> odio imperdiet. Duis turpis nulla, porta quis luctus ut, imperdiet et urna. 
					Pellentesque dapibus orci vitae metus luctus fringilla.</p>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin gravida luctus dui eu placerat. Aliquam vitae tincidunt lorem. Nam ligula neque, laoreet ut rhoncus et, varius at mi. Morbi sit amet rutrum velit. Phasellus blandit tincidunt quam vitae rhoncus.</p>
					
					<h3>Text With Image Right</h3>
					<img class="right-img" src="../img/placeholder.jpg" alt="Image description" />
					<p>Nulla id massa ac eros dignissim volutpat ac vel tortor. Praesent vel magna turpis, sed vehicula libero. Nullam viverra 
					ante vitae risus <a href="#">lobortis in sollicitudin</a> odio imperdiet. Duis turpis nulla, porta quis luctus ut, imperdiet et urna. 
					Pellentesque dapibus orci vitae metus luctus fringilla.</p>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin gravida luctus dui eu placerat. Aliquam vitae tincidunt lorem. Nam ligula neque, laoreet ut rhoncus et, varius at mi. Morbi sit amet rutrum velit. Phasellus blandit tincidunt quam vitae rhoncus.</p>
										
				</div>
				
				<div class="separator"></div>					
				
				<div class="one-half cf">
				
					<h3>Toggle Panels</h3>
				
					<div class="toggle-container">
						<div class="toggle-header">					
							<h4><a class="tog-open" href="#"><span></span>Heading Styles</a></h4>	
						</div>
						<div class="toggle-content">	
							<h1>Heading 1</h1>				
					
							<h2>Heading 2</h2>
							
							<h3>Heading 3</h3>
							
							<h4>Heading 4</h4>
							
							<h5>Heading 5</h5>
							
							<h6>Heading 6</h6>
						</div>
					</div><!-- end toggle-container -->	
					
					<div class="toggle-container">
						<div class="toggle-header">					
							<h4><a class="tog-open" href="#"><span></span>Button Examples</a></h4>
						</div>
						<div class="toggle-content">
							<a class="button tiny-btn" href="#">Tiny Button</a> <br />
							<a class="button small-btn" href="#">Small Button</a> <br />
							<a class="button medium-btn" href="#">Medium Button</a> <br />
							<a class="button large-btn" href="#">Large Button</a> <br />
						</div>
					</div><!-- end toggle-container -->	
					
					<div class="toggle-container">
						<div class="toggle-header">					
							<h4><a class="tog-open" href="#"><span></span>Aliquam eget lacus</a></h4>	
						</div>
						<div class="toggle-content">	
							<p>Aliquam eget lacus magna quis. Suspendisse sit amet odio pellentesque odio faucibus tristique. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor.</p>
						</div>
					</div><!-- end toggle-container -->	
					
				</div>
				
				<div class="one-half last cf">
				
					<h3>Accordion Panels</h3>
				
					<div class="accordion-container">
						<div class="accordion-header">					
							<h4><a class="acc-open" href="#"><span></span>Aliquam eget lacus</a></h4>	
						</div>
						<div class="accordion-content">	
							<p>Aliquam eget lacus magna quis. Suspendisse sit amet odio pellentesque odio faucibus tristique. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor.</p>
						</div>
					</div><!-- end accordion-container -->	
					
					<div class="accordion-container">
						<div class="accordion-header">					
							<h4><a class="acc-open" href="#"><span></span>Aliquam eget lacus</a></h4>	
						</div>
						<div class="accordion-content">	
							<p>Aliquam eget lacus magna quis. Suspendisse sit amet odio pellentesque odio faucibus tristique. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor.</p>
						</div>
					</div><!-- end accordion-container -->	
					
					<div class="accordion-container">
						<div class="accordion-header">					
							<h4><a class="acc-open" href="#"><span></span>Aliquam eget lacus</a></h4>
						</div>
						<div class="accordion-content">	
							<p>Aliquam eget lacus magna quis. Suspendisse sit amet odio pellentesque odio faucibus tristique. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor.</p>
						</div>
					</div><!-- end accordion-container -->	
					
				</div>
				
				<div class="separator"></div>	
				
				<h3>List styles</h3>
				
				<div class="one-third">	
					<ul class="custom-list check">
						<li>Consectetur adipiscing elit</li>
						<li>Aliquam in justo a sapien </li>
						<li>Massa euismod tempus</li>
						<li>Feugiat sodales pretium</li>			
					</ul>
				</div>	
				<div class="one-third">	
					<ol class="custom-list square">
						<li>Consectetur adipiscing elit</li>
						<li>Aliquam in justo a sapien </li>
						<li>Massa euismod tempus</li>
						<li>Feugiat sodales pretium</li>			
					</ol>
				</div>	
				<div class="one-third last">		
					<ul class="custom-list arrows">
						<li>Consectetur adipiscing elit</li>
						<li>Aliquam in justo a sapien </li>
						<li>Massa euismod tempus</li>
						<li>Feugiat sodales pretium</li>			
					</ul>
				</div>	
				<div class="one-third">					
					<ul class="custom-list crossed">
						<li>Consectetur adipiscing elit</li>
						<li>Aliquam in justo a sapien </li>
						<li>Massa euismod tempus</li>
						<li>Feugiat sodales pretium</li>			
					</ul>
				</div>	
				<div class="one-third">	
					<ol class="custom-list disc">
						<li>Consectetur adipiscing elit</li>
						<li>Massa euismod tempus</li>
						<li>Aliquam in justo a sapien </li>
						<li>Feugiat sodales pretium</li>											
					</ol>
				</div>	
				<div class="one-third last">			
					<ol class="custom-list">
						<li>Consectetur adipiscing elit</li>
						<li>Massa euismod tempus</li>
						<li>Aliquam in justo a sapien </li>
						<li>Feugiat sodales pretium</li>											
					</ol>
				</div>	
				
				<div class="separator"></div>
				
				<div class="full-width-margin cf">
					<h3>Pull Quote, Dropcaps and Highlights</h3>
					<p><span class="dropcap-1">A</span>orem ipsum dolor sit amet, consectetur <span class="highlight-1">this is a highlight</span> adipiscing elit. Quisque elit enim, consequat et rhoncus quis, tempus ac elit. Donec vel sem nibh, eu aliquet leo. Praesent dapibus, massa euismod tempus scelerisque, ipsum tellus faucibus arcu, quis convallis diam justo vel lorem. Praesentet metus in ante placerat sodales. Vestibulum nec convallis metus.</p>
					
					<blockquote class="quote-right">
						<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque elit enim, consequat et rhoncus quis, tempus ac elit. </p>
						<div class="author">John Doe <br /> Personalize, inc</div>
					</blockquote>					
						
					<p><span class="dropcap-2">B</span>orem ipsum dolor sit amet, consectetur adipiscing elit. Quisque elit enim, <span class="highlight-2">this is a highlight</span> consequat et rhoncus quis, tempus ac elit. Donec vel sem nibh, eu aliquet leo. Praesent dapibus, massa euismod tempus scelerisque, ipsum tellus.</p>
					<p>Faucibus arcu, quis convallis diam <span class="highlight-3">this is a highlight</span> justo vel lorem. Praesentet metus in ante placerat sodales. Vestibulum nec convallis metus. Suspendisse potenti. Aliquam vel faucibus lectus. Pellentesque consectetur placerat sem non tincidunt. Maecenas bibendum fermentum 
					imperdiet. Suspendisse turpis massa, aliquet ut semper sed. Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
					massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas.</p>				
									
				</div>	
				
				<div class="separator"></div>
				
				<div class="full-width">

					<h3>Notification Boxes</h3>
					
					<div class="yellow-info info-box">					
						<a class="info-close" href="#">X</a>	
						
						<h4>Yellow Info Box</h4>
						<p>Aenean porttitor, lectus at dapibus egestas. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem.</p>
					</div>
					
					<div class="green-info info-box">					
						<a class="info-close" href="#">X</a>
					
						<h4>Green Info Box</h4>
						<p>Aenean porttitor, lectus at dapibus egestas. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem.</p>
					</div>
					
					<div class="red-info info-box">					
						<a class="info-close" href="#">X</a>
						
						<h4>Red Info Box</h4>
						<p>Aenean porttitor, lectus at dapibus egestas. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem.</p>
					</div>
					
					<div class="blue-info info-box">
						<a class="info-close" href="#">X</a>
						
						<h4>Blue Info Box</h4>
						<p>Aenean porttitor, lectus at dapibus egestas. Fusce scelerisque pellentesque mi. Suspendisse elementum tellus ut quam pharetra vel volutpat et, euismod eu sem.</p>
					</div>
					
				</div>
								
				
			</div><!-- end elements -->
	

	<!-- BLOG PAGE -->

	
			<div id="blog" class="page">			
				<h2 class="title">The Blog</h2>
				<p class="page-subtitle">-Yet Another Subtitle-</p>		
				
				<div class="blog-post cf">				
					<div class="meta">
						<div class="blog-type text-post"></div><!-- end blog-type -->
						<div class="date">
							<span class="day">6</span>
							<span class="month">feb</span>
						</div><!-- end date -->
						
						<div class="share-post">
							
							<ul class="share-networks">
								<li><a class="facebook-tran" href="#"></a></li>
								<li><a class="pinterest-tran" href="#"></a></li>
								<li><a class="google-tran" href="#"></a></li>
								<li><a class="twitter-tran" href="#"></a></li>
							</ul>
							
							<a class="share-btn closed" href="#">Share</a>
							
						</div><!-- share-post -->
												
					</div><!-- end meta -->
					
					<div class="blog-preview">
						<a class="img-link" href="blog-single.html">
							<img src="../img/blog/001.jpg" alt="Image Description" />
						</a>
						
						<div class="blog-title">
							<h3><a href="blog-single.html">Champagne Supernova</a></h3>
							<span class="tags">by <a href="#">Admin</a> in <a href="#">Photoshop</a>, <a href="#">InDesign</a>, <a href="#">Fireworks</a> with <a href="#">5 comments</a></span>
						</div><!-- end blog-title -->
						
						<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
						massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas, tellus ipsum rhoncus orci, eu 
						vestibulum nisi orci quis nunc. Vivamus sit amet odio pellentesque odio faucibus tristique.</p>
						
						<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
						massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas.</p>
						
						<a class="button small-btn" href="blog-single.html">Continue Reading</a>
						
					</div><!-- end blog-preview -->					
					
				</div><!-- end blog-post -->
				
				<div class="separator"></div>
				
				<div class="blog-post cf">				
					<div class="meta">
						<div class="blog-type photo-post"></div><!-- end blog-type -->
						<div class="date">
							<span class="day">4</span>
							<span class="month">feb</span>
						</div><!-- end date -->
						
						<div class="share-post">
							
							<ul class="share-networks">
								<li><a class="facebook-tran" href="#"></a></li>
								<li><a class="pinterest-tran" href="#"></a></li>
								<li><a class="google-tran" href="#"></a></li>
								<li><a class="twitter-tran" href="#"></a></li>
							</ul>
							
							<a class="share-btn closed" href="#">Share</a>
							
						</div><!-- share-post -->
												
					</div><!-- end meta -->
					
					<div class="blog-preview">
						<a class="img-link" href="blog-single.html">
							<img src="../img/blog/002.jpg" alt="Image Description" />
						</a>
						
						<div class="blog-title">
							<h3><a href="blog-single.html">Definitely Maybe</a></h3>
							<span class="tags">by <a href="#">Admin</a> in <a href="#">Photoshop</a>, <a href="#">InDesign</a>, <a href="#">Fireworks</a> with <a href="#">5 comments</a></span>
						</div><!-- end blog-title -->
						
						<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
						massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas, tellus ipsum rhoncus orci, eu 
						vestibulum nisi orci quis nunc. Vivamus sit amet odio pellentesque odio faucibus tristique.</p>
						
						<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
						massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas.</p>
						
						<a class="button small-btn" href="blog-single.html">Continue Reading</a>
						
					</div><!-- end blog-preview -->					
					
				</div><!-- end blog-post -->
				
				<div class="separator"></div>
				
				<div class="blog-post cf">				
					<div class="meta">
						<div class="blog-type video-post"></div><!-- end blog-type -->
						<div class="date">
							<span class="day">30</span>
							<span class="month">jan</span>
						</div><!-- end date -->
						
						<div class="share-post">
							
							<ul class="share-networks">
								<li><a class="facebook-tran" href="#"></a></li>
								<li><a class="pinterest-tran" href="#"></a></li>
								<li><a class="google-tran" href="#"></a></li>
								<li><a class="twitter-tran" href="#"></a></li>
							</ul>
							
							<a class="share-btn closed" href="#">Share</a>
							
						</div><!-- share-post -->
												
					</div><!-- end meta -->
					
					<div class="blog-preview">
					
						<iframe src="http://player.vimeo.com/video/7449107?title=0&amp;byline=0&amp;portrait=0" width="632" height="269"></iframe>	
						
						<div class="blog-title">
							<h3><a href="#">What's The Story, Morning Glory</a></h3>
							<span class="tags">by <a href="#">Admin</a> in <a href="#">Photoshop</a>, <a href="#">InDesign</a>, <a href="#">Fireworks</a> with <a href="#">5 comments</a></span>
						</div><!-- end blog-title -->
						
						<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
						massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas, tellus ipsum rhoncus orci, eu 
						vestibulum nisi orci quis nunc. Vivamus sit amet odio pellentesque odio faucibus tristique.</p>
						
						<p>Vivamus sit amet odio pellentesque odio faucibus tristique. Morbi facilisis, ligula a faucibus pellentesque, orci justo consequat 
						massa, sit amet dapibus dolor diam viverra mi. Aenean porttitor, lectus at dapibus egestas.</p>
						
						<a class="button small-btn" href="#">Continue Reading</a>
						
					</div><!-- end blog-preview -->					
					
				</div><!-- end blog-post -->				
				
			</div><!-- end blog -->
	

	<!-- CONTACT PAGE -->

	
			<div id="contact" class="page cf">			
				<h2 class="title">Contact Us</h2>
				<p class="page-subtitle">-Yet Another Subtitle-</p>	

				<div id="google-map">
					<iframe width="690" height="305" src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Smederevska+Palanka,+Central+Serbia&amp;aq=1&amp;sll=38.918167,-97.209177&amp;sspn=0.013239,0.031478&amp;ie=UTF8&amp;hq=&amp;hnear=Smederevska+Palanka,+Central+Serbia,+Serbia&amp;ll=44.362029,20.961227&amp;spn=0.015341,0.033216&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe>
				</div>
				
				<div class="separator"></div>
				
				<div class="two-third">
					<div class="col-title">
						<h3>Drop Us a Line</h3>
						<span class="subtitle">If you have any questions</span>
					</div>
					
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin  sapien risus, bibendu
					ac tempor ac, posuere id magna. Fusce scelerisque pellentesqusus.</p>
					
					<form id="contact-form" method="post" action="http://www.ivanjevremovic.in.rs/live/motivation/orange/submitemail.php">						
						<label for="name">Name: (*)</label><input  class="textbox" type="text" name="name" id="name" />
						<label for="email">E-mail: (*)</label><input  class="textbox" type="text" name="email" id="email" />
						<label for="subject">Subject: </label><input  class="textbox" type="text" name="subject" id="subject" />					
						<label for="message">Message: (*)</label><textarea class="textbox" name="message" id="message"></textarea>
						<label for="check">Answer: (*)</label><span class="security-question"></span><input type="text" name="check" id="check" /><br />
						<input class="button small-btn" type="submit" name="submit" value="Send Message" id="submit" /> <br />
						<p id="message-outcome"></p>
					</form>
					
				</div>
				
				<div class="one-third last">
					<div class="col-title">
						<h3>Contact Details</h3>
						<span class="subtitle">Want To Talk With Us?</span>
					</div>					
									
					<span class="contact-details">Address:</span>
					
					<p>
					Name of the street 123/4 <br />
					Name of the City <br />
					Name of the Country <br />
					</p>
					
					<span class="contact-details">Phone Numbers:</span>
					
					<p>
						+321 123 456 <br />
						+321 654 456 <br />
					</p>
					
					<span class="contact-details">Email and Website:</span>
					
					<p>
						E-mail: <a href="#">johndoe@ipsum.com</a> <br />
						Website: <a href="#">www.loremipsum.com</a> <br />
					</p>
					
					<span class="contact-details">Downloads:</span>
					
					<ul>
					<li><a href="#">Latest Projects - PDF</a><br /></li>
					<li><a href="#">Our vCard</a><br /></li>
					<li><a href="#">Some Random Download Link</a><br /></li>
					</ul>
				</div>
			</div><!-- end contact -->
						
		</div><!-- end right-side -->
		
	</div><!-- end container -->	

</body>


<!-- Mirrored from www.ivanjevremovic.in.rs/live/motivation/orange/index-content-slider.html by HTTrack Website Copier/3.x [XR&CO'2010], Mon, 18 Mar 2013 08:35:06 GMT -->
</html>